
import { memo, useCallback } from 'react'
import HomeLinkModel from '@models/homeLinkModel'
import { List } from 'antd-mobile';
// @ts-ignore
import Styles from './index.scss'

const Item = List.Item;

interface PropsInterface {
  models: HomeLinkModel[]
}
const HomeLinks = (props: PropsInterface) => {

  const itemClick = useCallback((item: HomeLinkModel) => {
    window.open(item.link)
  }, [])

  return (
    <List>
      {
        props.models.map((item) => {
          return <Item
            arrow="horizontal"
            key={item._id}
            onClick={() => itemClick(item)}>{item.title}</Item>
        })
      }
    </List>
  )
}

export default memo(HomeLinks)